import React from 'react';
import { connect } from 'react-redux';
import { withRouter, NavLink } from 'react-router-dom';
import {
    SettingOutlined, LeftOutlined, UserAddOutlined
} from '@ant-design/icons';
import action from '../store/action/index';

class NavTop extends React.Component {
    constructor(props, context) {
        super(props, context);
    }

    render() {
        return <header className='headerNavBox'>
            {/*Home navigation*/}
            <div className='homeBox'>
                <div className='baseBox'>
                    <NavLink className='topIcon left' to='/person'>
                        <SettingOutlined />
                    </NavLink>
                    {/* <NavLink className='topIcon left' to='/candidate'>
                        <LeftOutlined />
                    </NavLink> */}
                    <h1 className="title">CONTACTS</h1>
                    <NavLink className='topIcon right' to='/candidate/create'>
                        <UserAddOutlined />
                    </NavLink>
                </div>
            </div>
        </header>;
    }
}

export default withRouter(connect(null, action.candidate)(NavTop));